<template>
  <div style="margin: 15px">
    <div
    style="
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 15px;
    "
  >
    <div style="display: flex; align-items: center" @click="toIndex()">
      <img src="../../assets/fitness/icon_back.png" alt="" style="" />
    </div>
    <div
      style="
        text-align: center;
        font-family: Source Han Sans, Source Han Sans;
        font-weight: 400;
        font-size: 16px;
        color: #333333;
      "
    >
      支付确认
    </div>
    <div></div>
  </div>
    <div>
      <div style="font-size: 18px; font-weight: 700; margin-bottom: 25px">
        价格清单
      </div>
      <van-collapse v-model="activeNames">
        <van-collapse-item title="羽毛球" name="1">10元/时</van-collapse-item>
        <van-collapse-item title="乒乓球" name="2"> 5元/时</van-collapse-item>
        <van-collapse-item title="台球" name="3">5元/时</van-collapse-item>
      </van-collapse>
    </div>
    <div class="fei" style="    font-size: 20px;
    color: #f20000;
    margin-top: 10px;">
    试运营期间暂不收费；<br>
相关费用将用于场地的各项开支；
    </div>
    <div style="position: fixed; width: 100%; bottom: 1px; left: 1px">
      <van-button
        style="background: red; color: #ffffff"
        class="add-customer-button"
        type="default"
        @click="onAddCustomer"
        >去支付</van-button
      >
    </div>
  </div>
</template>
    
    <script>
import { Toast, Checkbox, ContactCard, Button } from "vant";
import { getCarous } from "../../api/index";

export default {
  components: {},
  data() {
    return {
      activeNames: ["1", "2", "3"],
      type: "",
    };
  },
  created() {},
  mounted() {
    
    const itemString = this.$route.query.item;
 
    // 解析 JSON 字符串以获取 JavaScript 对象
    const item = JSON.parse(itemString);
    console.log( item, " this.typ222e");
    this.type=item.APPLY_NO;
    console.log( this.type, " this.type");
   
  },
  methods: {
    onAddCustomer() {
      this.$dialog
        .confirm({
          title: "确认支付吗",
        })
        .then(() => {
          console.log("555555555");
          var param = {
            cmd: "com.awspaas.user.apps.sfeg.tu.honor.pay_my_order_venues",

            dduserid: window.dduserid,
            applyNo: this.type,
          };
      
          getCarous(param).then((res) => {
            const { result, msg, data, id } = res;
            console.log(res, "res");

            if (result === "ok") {
              console.log(res, "res");
              this.$toast.success({
                message: data.msg,
              });
              setTimeout(() => {
              this.$router.push({ path: "/myList" });
            }, 2000);
            } else {
              // this.finished = true;
            }
          });
          // on confirm
        })
        .catch(() => {
          // on cancel
        });
    },
    toIndex() {
      this.$router.replace({
        name: "myList",
      });
    },
  },
};
</script>
    
    <style lang="scss" scoped>
.selected-contact {
  background-color: #f5f5f5;
}
.button-wrapper {
  display: flex;
  position: fixed;
  bottom: 0;
  width: 100%;
  left: 0;
}
.submit-button,
.add-customer-button {
  width: 100%;
}
</style>
    